body{
	font-size: 28upx;
	background-color: #F0F4F9;
	// background-color: #FFFFFF;
}

.bg-default{
	background-color: #F0F4F9;
	// background-color: red;
}

// 白色背景
.bg-white{
	background-color: #FFFFFF;
}

.bg-blue{
	background-color: #529DFF;
	color: #FFFFFF;
}

.bg-blue-light{
	background-color: #006EFF;
	color: #FFFFFF;
}

.bg-gray {
	background-color: #f0f0f0;
	color: #C1C1C1;
}

.bg-black{
	background-color: #000000;
	color: #FFFFFF;
}

.bg-red{
	background-color: #FF4747;
	color: #FFFFFF;
}


// 圆角
@for $i from 0 through 50 {
	.b-r-#{$i} {
		border-radius: $i + rpx;
	}
}

// 内容居中
.text-center{
	text-align: center;
}

// 内容左对齐
.text-left{
	text-align: left;
}

// 内容左对齐
.text-right{
	text-align: right;
}

// 文字加粗
.text-bold {
	font-weight: bold;
}

.text-red{
	color: #FF4747;
}

.text-blue{
	color: #006EFF;
}

.text-orange{
	color: #FFB143;
}

.text-white{
	color: #FFFFFF;
}

.text-gray{
	color: #C1C1C1;
}


/**
 * 左对齐
 */
.fl{
	float: left;
}

/**
 * 右对齐
 */
.fr{
	float: right;
}

.u-flex{
	display: flex;
	flex-direction: row;
	align-items: center;
}

.u-flex-end{
	justify-content: flex-end;
}

.u-flex-center{
	justify-content: center;
}

.u-flex-between{
	justify-content: space-between;
}
/* -- 实线 -- */

.solid,
.solid-top,
.solid-right,
.solid-bottom,
.solid-left,
.solids,
.solids-top,
.solids-right,
.solids-bottom,
.solids-left,
.dashed,
.dashed-top,
.dashed-right,
.dashed-bottom,
.dashed-left {
	position: relative;
}

.solid::after,
.solid-top::after,
.solid-right::after,
.solid-bottom::after,
.solid-left::after,
.solids::after,
.solids-top::after,
.solids-right::after,
.solids-bottom::after,
.solids-left::after,
.dashed::after,
.dashed-top::after,
.dashed-right::after,
.dashed-bottom::after,
.dashed-left::after {
	content: " ";
	width: 200%;
	height: 200%;
	position: absolute;
	top: 0;
	left: 0;
	border-radius: inherit;
	transform: scale(0.5);
	transform-origin: 0 0;
	pointer-events: none;
	box-sizing: border-box;
}

.solid::after {
	border: 1upx solid rgba(0, 0, 0, 0.1);
}

.solid-top::after {
	border-top: 1upx solid rgba(0, 0, 0, 0.1);
}

.solid-right::after {
	border-right: 1upx solid rgba(0, 0, 0, 0.1);
}

.solid-bottom::after {
	border-bottom: 1upx solid rgba(0, 0, 0, 0.1);
}

.solid-left::after {
	border-left: 1upx solid rgba(0, 0, 0, 0.1);
}

.solids::after {
	border: 8upx solid #eee;
}

.solids-top::after {
	border-top: 8upx solid #eee;
}

.solids-right::after {
	border-right: 8upx solid #eee;
}

.solids-bottom::after {
	border-bottom: 8upx solid #eee;
}

.solids-left::after {
	border-left: 8upx solid #eee;
}

/* -- 虚线 -- */

.dashed::after {
	border: 1upx dashed #000;
}

.dashed-top::after {
	border-top: 1upx dashed #000;
}

.dashed-right::after {
	border-right: 1upx dashed #000;
}

.dashed-bottom::after {
	border-bottom: 10upx dashed #000;
}

.dashed-left::after {
	border-left: 1upx dashed #000;
}

/* -- 阴影 -- */

.shadow[class*='white'] {
	--ShadowSize: 0 1upx 6upx;
}

.shadow-lg {
	--ShadowSize: 0upx 40upx 100upx 0upx;
}

.shadow-warp {
	position: relative;
	box-shadow: 0 0 10upx rgba(0, 0, 0, 0.1);
}

.shadow-warp:before,
.shadow-warp:after {
	position: absolute;
	content: "";
	top: 20upx;
	bottom: 30upx;
	left: 20upx;
	width: 50%;
	box-shadow: 0 30upx 20upx rgba(0, 0, 0, 0.2);
	transform: rotate(-3deg);
	z-index: -1;
}

.shadow-warp:after {
	right: 20upx;
	left: auto;
	transform: rotate(3deg);
}

.shadow-blur {
	position: relative;
}

.shadow-blur::before {
	content: "";
	display: block;
	background: inherit;
	filter: blur(10upx);
	position: absolute;
	width: 100%;
	height: 100%;
	top: 10upx;
	left: 10upx;
	z-index: -1;
	opacity: 0.4;
	transform-origin: 0 0;
	border-radius: inherit;
	transform: scale(1, 1);
}

// 定义字体(rpx)单位，大于或等于10的都为rpx单位字体
@for $i from 10 through 80 {
	.u-font-#{$i} {
		font-size: $i + rpx;
	}
}

// 定义内外边距，历遍1-120
@for $i from 0 through 120 {
	// 只要双数和能被5除尽的数
	@if $i % 2 == 0 or $i % 5 == 0 {
		// 得出：u-margin-30或者u-m-30
		.u-margin-#{$i}, .u-m-#{$i} {
			margin: $i + rpx!important;
		}
		
		// 得出：u-padding-30或者u-p-30
		.u-padding-#{$i}, .u-p-#{$i} {
			padding: $i + rpx!important;
		}
		
		@each $short, $long in l left, t top, r right, b bottom {
			// 缩写版，结果如： u-m-l-30
			// 定义外边距
			.u-m-#{$short}-#{$i} {
				margin-#{$long}: $i + rpx!important;
			}
			
			// 定义内边距
			.u-p-#{$short}-#{$i} {
				padding-#{$long}: $i + rpx!important;
			}
			
			// 完整版，结果如：u-margin-left-30
			// 定义外边距
			.u-margin-#{$long}-#{$i} {
				margin-#{$long}: $i + rpx!important;
			}
			
			// 定义内边距
			.u-padding-#{$long}-#{$i} {
				padding-#{$long}: $i + rpx!important;
			}
		}
	}
}

.u-relative,
.u-rela {
	position: relative;
}

.u-absolute,
.u-abso {
	position: absolute;
}


/* #ifndef APP-NVUE */
image {
	display: inline-block;
}

view,
text {
	box-sizing: border-box;
}
/* #endif */

.u-font-xs {
	font-size: 22rpx;
}

.u-font-sm {
	font-size: 26rpx;
}

.u-font-md {
	font-size: 28rpx;
}

.u-font-lg {
	font-size: 30rpx;
}

.u-font-xl {
	font-size: 34rpx;
}

.u-flex {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: row;
	align-items: center;
}

.u-flex-wrap {
	flex-wrap: wrap;
}

.u-flex-nowrap {
	flex-wrap: nowrap;
}

.u-col-center {
	align-items: center;
}

.u-col-top {
	align-items: flex-start;
}

.u-col-bottom {
	align-items: flex-end;
}

.u-row-center {
	justify-content: center;
}

.u-row-left {
	justify-content: flex-start;
}

.u-row-right {
	justify-content: flex-end;
}

.u-row-between {
	justify-content: space-between;
}

.u-row-around {
	justify-content: space-around;
}

.u-text-left {
	text-align: left;
}

.u-text-center {
	text-align: center;
}

.u-text-right {
	text-align: right;
}

.u-flex-col {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: column;
}

// 定义flex等分
@for $i from 0 through 12 {
	.u-flex-#{$i} {
		flex: $i;
	}
}

// 定义常用颜色
$color_name_list: "222", "777", "aaa";
$color_list: #222, #777, #aaa;
@each $color in $color_list {
    $i: index($color_list, $color);
    $name: nth(
        $list: $color_name_list,
        $n: $i,
    );
    .u-color-#{$name} {
      color: $color
    }
}

.u-w-100p {
	width: 100%;
}

.u-h-100p {
	height: 100%;
}

// 定义宽度(rpx)单位
@for $i from 0 through 750 {
	.u-w-#{$i} {
		width: $i + rpx;
	}
}

// 定义高度(rpx)单位
@for $i from 0 through 750 {
	.u-h-#{$i} {
		height: $i + rpx;
	}
}

// 定义行高(rpx)单位
@for $i from 0 through 100 {
	.u-line-h-#{$i} {
		line-height: $i + rpx;
	}
}

// 定义字体(rpx)单位，大于或等于10的都为rpx单位字体
@for $i from 10 through 80 {
	.u-font-#{$i} {
		font-size: $i + rpx;
	}
}

// 定义内外边距，历遍1-80
@for $i from 0 through 120 {
	// 只要双数和能被5除尽的数
	@if $i % 2 == 0 or $i % 5 == 0 {
		// 得出：u-margin-30或者u-m-30
		.u-margin-#{$i}, .u-m-#{$i} {
			margin: $i + rpx!important;
		}
		
		// 得出：u-padding-30或者u-p-30
		.u-padding-#{$i}, .u-p-#{$i} {
			padding: $i + rpx!important;
		}
		
		@each $short, $long in l left, t top, r right, b bottom {
			// 缩写版，结果如： u-m-l-30
			// 定义外边距
			.u-m-#{$short}-#{$i} {
				margin-#{$long}: $i + rpx!important;
			}
			
			// 定义内边距
			.u-p-#{$short}-#{$i} {
				padding-#{$long}: $i + rpx!important;
			}
			
			// 完整版，结果如：u-margin-left-30
			// 定义外边距
			.u-margin-#{$long}-#{$i} {
				margin-#{$long}: $i + rpx!important;
			}
			
			// 定义内边距
			.u-padding-#{$long}-#{$i} {
				padding-#{$long}: $i + rpx!important;
			}
		}
	}
}

// 重置nvue的默认关于flex的样式
.u-reset-nvue {
	flex-direction: row;
	align-items: center;
}

.line-through{
	text-decoration: line-through
}